<template>
  <div class="cricle">
    <slot></slot>
  </div>
</template>

<script>
export default {
  name: 'cricle'
}
</script>

<style lang="scss" scoped>
  $radius: 160px;
  $border-width: 30px;
  .cricle {
    display: flex;
    justify-content: center;
    align-items: center;

    width: $radius;
    height: $radius;
    border-radius: 50%;
    background-color: #2795ff;
    border: $border-width solid #a9d4ff;

    z-index: 1;
    box-sizing: border-box;

  }
</style>
<style lang="scss">
.cricle {
  .li-label__text {
    color: #fff;
  }
}
</style>

